<%= open_graph_tags title: t(".og_title", with: @conversation.deleted_business_or_developer? ? t("deleted_account") : @conversation.other_recipient(current_user).name) %>
<%= render "shared/error_messages", resource: @message %>

<div class="min-h-full max-w-2xl mx-auto py-12 sm:px-6 lg:px-8">
  <div class="mt-6 flex items-start justify-between">
    <h1 class="text-3xl px-6">
      <span class="font-extrabold"><%= t(".title") %></span>

      <div class="flex items-center space-x-2 mt-2 text-sm text-gray-600">
        <div class="block"><%= t(".with") %></div>
        <% if @conversation.deleted_business_or_developer? %>
          <span class="font-medium text-gray-600 group-hover:text-gray-500">
            <%= t("deleted_account") %>
          </span>
        <% else %>
          <%= link_to polymorphic_path(@conversation.other_recipient(current_user)), class: "flex items-center space-x-2 group" do %>
            <%= render AvatarComponent.new(avatarable: @conversation.other_recipient(current_user), variant: :thumb, classes: "h-8 w-8") %>
            <span class="font-medium text-gray-600 group-hover:text-gray-500"><%= @conversation.other_recipient(current_user).name %></span>
          <% end %>
      <% end %>
      </div>
    </h1>

    <%= link_to new_conversation_block_path(@conversation), data: {"turbo-frame": "modal"}, class: "mt-2 mr-2 flex items-center text-gray-400 hover:text-gray-600" do %>
      <span class="sr-only"><%= t(".flag") %></span>
      <%= inline_svg_tag "icons/solid/flag.svg", class: "h-5 w-5", aria_hidden: true %>
    <% end %>
  </div>

  <ul id="messages" class="mt-8 space-y-2">
    <%= render @conversation.messages %>
  </ul>

  <div class="my-3 mx-4">
    <%= turbo_frame_tag "message_read_indicator" do %>
      <%= render Conversations::ReadIndicatorComponent.new(current_user, conversation: @conversation) %>
    <% end %>
  </div>

  <div class="mt-8 max-w-prose w-full mx-auto px-4 sm:px-0 pb-6">
    <% if policy(@message).create? %>
      <%= render Businesses::SchedulingLinkComponent.new(current_user, @conversation) %>
      <div class="mt-4">
        <%= turbo_frame_tag "new_message" do %>
          <%= render "conversations/new_message", conversation: @conversation, message: @message %>
        <% end %>
      </div>
    <% else %>
      <%= render Businesses::UpgradeRequiredComponent.new(current_user) %>
    <% end %>
    <%= render Businesses::HiringFeeComponent.new(current_user, @conversation) %>
  </div>
</div>
